<template>
  <div class="login-container">
    <van-nav-bar title="登录" fixed/>
    <van-cell-group>
      <van-field
          v-model.trim="text"
          required
          label="账号"
          placeholder="请输入账号"
      />
      <van-field
          v-model="password"
          required
          type="password"
          placeholder="请输入密码"
          label="密码"/>
    </van-cell-group>
    <!-- 登录-->
    <van-button type="primary" @click="enter" block>登录</van-button>

  </div>
</template>

<script>
import { Notify } from 'vant';

export default {
  name: "Login",
  data() {
    return {
      text: '',
      password: '',
    };
  },
  methods:{
    enter() {
      if (this.text === '' && this.password === '') {
        Notify({type: 'warning', message: '请输入登录信息!'});
      } else if (this.text === 'admin' && this.password === '123456') {
        // 存储 token
        localStorage.setItem('token', 'Bearer xxx')
        // 验证成功,直接跳转至home
        this.$router.push('/home');
        Notify({type: 'success', message: '登录成功!'});
      } else {
        localStorage.removeItem('token')
        Notify({type: 'danger', message: '账号或密码错误!'});
      }
    }


  }

}
</script>

<style lang="less" scoped>
.login-container {
  padding: 46px 0 50px 0;

  .van-nav-bar {
    background-color: #007bff;
  }

  /deep/ .van-nav-bar__title {
    color: white;
  }
}
</style>